<template>
  <div class="title-bar flex_row">
    <div class="tl col">
      <span class="title-name clr_303">
        <i class="iconfont mr10">&#xe703;</i>{{firstTitle}}
        <i class="iconfont mr10">&#xe704;</i>{{subTitle}}
        <i v-if="thirdTitle" class="iconfont mr10">&#xe704;</i>{{thirdTitle}}

      </span>
    </div>
  </div>
</template>

<script>
export default {
  props: ['firstTitle', 'subTitle','thirdTitle'],
  data() {
    return {}
  }
}
</script>

<style lang="less" scoped>
.title-bar {
  height: 46px;
  line-height: 46px;
  padding: 0 20px;
  color: #303133;
  background-color: #ffffff;
  border-bottom: 1px solid #ddd;
  .title-name {
    display: inline-block;
  }
}
</style>